<style scoped>
    
    .d-lb{
        display: inline-block
    }
    .tr{text-align: right}
    .tc{text-align: center}
    
    .div{
        padding: 5px 10px;
        background: white;
    
        line-height: 28px;
        /* font-size: 14px; */
        font-size: .3rem;
    }
     .ktbtn {
        color: white;
        display: block;
        border: none;
        background-color: #2A71C8;
        width: 90%;
        margin: 0 auto;
        margin-top: 30px;
        /* line-height: 40px; */
        border-radius: 5px;
        padding: 12px;
        font-size: 17px;
    }
</style>



<template>
    <div>
        <div v-wechat-title="$route.meta.title"></div>
        <!-- <van-nav-bar title="确认订单" left-arrow @click-left="goback" style="color:white;background:#2A71C8" /> -->
        <div style="height:10px;"></div>
        <div style="background:white;">
            <div style="padding:10px 0;font-size: 16px;" class='tc' >
                <p style="font-size: 30px;color: #2A71C8;">￥{{queren.amount}}</p>
                <p style="color: #949494;">交易金额（元）</p>
            </div>
        </div>

        <div class="div">
            <p>
                <span class="d-lb" style="width:30%">到账银行卡</span>
                <span  class="d-lb tr" style="width:70%">{{queren.scard.bankCard }} 【{{ queren.scard.bankCode | fmtscname}}】</span>
            </p>
             <p>
                <span class="d-lb" style="width:30%">预留手机号</span>
                <span class="d-lb tr" style="width:70%">{{queren.scard.reservePhone}}</span>
            </p>
        </div>
        <div style="margin-top: 10px;font-size: 15px;">
           
            <van-field v-model="cvv2" type="number" label="CVV2：" placeholder="请输入后三位" required/>

            <van-field is-link readonly  clickable label="有效期年"  :value="year"  placeholder="选择年" @click="yearshow = true"/>
            <van-popup v-model="yearshow" position="bottom" :style="{ height: '40%' }">
                <van-picker show-toolbar :columns="yearlist" @cancel="yearshow = false"  @confirm="onConfirm"  />
            </van-popup>

            <van-field is-link readonly  clickable label="有效期月"  :value="month"  placeholder="选择月" @click="monthshow = true"/>
            <van-popup v-model="monthshow" position="bottom" :style="{ height: '40%' }">
                <van-picker show-toolbar :columns="monthlist" @cancel="monthshow = false"  @confirm="onConfirmMonth"  />
            </van-popup>

        </div>
        
         <button class="ktbtn" @click="pay()"> 确认</button>
    </div>
</template>
<script>
    import {
        Toast
    } from 'vant';
//    import { Picker } from 'vant';

    export default {
        data() {
            return {
                host:this.GLOBAL.host,
                // hosth:'http://192.168.1.187/yj-epos',
                cvv2:'',
                year:'',
                month:'',
                monthshow:false,
                yearshow:false,
                finished:false,
                yearlist:[],
                monthlist:[],
                queren:this.GLOBAL.queren,
               
            }
        },
        created() {
            // this.queren.scard
            console.log("this.queren.scard",this.queren.scard)
            console.log("this.queren.ccard",this.queren.ccard)
            //月
            for(let i=1;i<=12;i++){
                i=i < 10 ? '0' + i : i;
                this.monthlist.push(i)
            }
           
            
            console.log(this.yearlist)
            //年
            for(let i=19;i<=29;i++){
                i=i < 10 ? '0' + i : i;
                this.yearlist.push(i)
            }
           
        },
       
        methods: {
           
            onConfirm(value) {
                console.log(value)
                this.year = value;
                this.yearshow = false;
            },
          
            onConfirmMonth(value){
                this.month = value;
                this.monthshow = false;
            },
            pay() {
                if (this.cvv2 == null || this.cvv2.length != 3) {
                    Toast('请输入正确的cvv2');
                    return;
                }
                if (this.year == '' || this.month == '' ) {
                    Toast('请输入正确的有效期');
                    return;
                }
                Toast.loading({
                    mask: true,
                    message: '加载中',
                    duration:0,
                });
                if(this.queren.ccard.bankCode == null || this.queren.ccard.bankCode == '' ){
                     this.queren.ccard.bankCode = "other"
                }
                axios.get(this.host + '/bind/seleteRate',{  //获取费率
                    params: {
                        id:this.GLOBAL.id,
                    }
                }
                ).then(res => {
                    if (res.data.code == "0000") {
                        if(res.data.data != null){
                            var dofee=res.data.data.singlePrice
                            axios.post(this.host + '/bind/updateRate', this.$qs.stringify({   //更新费率
                                aisleMerId: this.queren.merchantNo,
                                rate:res.data.data.rate,
                                bankCode:this.queren.ccard.bankCode,
                                amount:this.GLOBAL.accMul(this.queren.amount,100),
                                productIdfin:"PN777"//PNS66
                            })
                            ).then(res => {
                                if (res.data.code == "0000") {
                                    axios.post(this.host + '/bind/updateD0fee', this.$qs.stringify({   //更新 D0 费率
                                        aisleMerId: this.queren.merchantNo,
                                        d0Fee:dofee,
                                    })).then(res => {
                                        if (res.data.code == "0000") {
                                            axios.post(this.host + '/order/pay', this.$qs.stringify({   //支付
                                                frontCallBackUrl:'https://community.1818pay.cn:1181/yj-jpos/location.html',
                                                // frontCallBackUrl:'www.baidu.com'
                                                lng:'116.40',//精度
                                                lat:'39.90',//维度
                                                aisleMerId: this.queren.merchantNo , 
                                                id:this.GLOBAL.id,
                                                productIdfin:"PN777",
                                                amount:this.GLOBAL.accMul(this.queren.amount,100),
                                                creditCardNo:this.queren.ccard.bankCard,  //
                                                creditPhone:this.queren.ccard.reservePhone,  //
                                                creditCardCode:this.queren.ccard.bankCode,  //
                                            })).then(res => {
                                                if (res.data.code == "0000") {
                                                    Toast.clear();
                                                    this.GLOBAL.orderNo=res.data.data.orderNo
                                                    if(this.GLOBAL.terminal == 'iOS' ){
                                                        window.location=res.data.data.url.payUrl
                                                    }else{
                                                        this.GLOBAL.payUrl=res.data.data.url.payUrl
                                                        this.$router.push({
                                                            name:'qrcode'
                                                        })
                                                    }
                                                }else{
                                                    Toast.clear();
                                                    return Toast(res.data.msg);
                                                }
                                            }).catch(err=>{
                                                Toast.clear();
                                                return Toast('请求超时');
                                            })
                                        }else{
                                            Toast.clear();
                                            return Toast(res.data.msg);
                                        }
                                    }).catch(err=>{
                                        Toast.clear();
                                        return Toast('请求超时');
                                    })
                                }else{
                                    Toast.clear();
                                    return Toast(res.data.msg);
                                }
                            }).catch(err=>{
                                Toast.clear();
                                return Toast('请求超时');
                            })
                        }else{
                            Toast.clear();
                            return Toast('请求超时');
                        }
                    }else{
                        Toast.clear();
                        return Toast(res.data.msg);
                    }
                }).catch(err=>{
                    Toast.clear();
                    return Toast('请求超时');
                })
               

            },
           
            goback() {
                this.$router.push({
                    name: "index"
                })
            },
        },
        filters: {
            fmtscname: function (fmtscname) {
                var mccname = {
                'ICBC': "工商银行",
                'ABC': "农业银行",
                'BOC': "中国银行",
                'CCB': "建设银行",
                'CMBCHINA': "招商银行",
                'POST': "邮政储蓄",
                'ECITIC': "中信银行",
                'CEB': "光大银行",
                'BOCO': "交通银行",
                'CIB': "兴业银行",
                'CMBC': "民生银行",
                'PINGAN': "平安银行",
                'CGB': "广发银行",
                'HXB': "华夏银行",
                'SPDB': "浦发银行",
                'SHB': "上海银行",
                'CBHB': "渤海银行",
                'JSB': "江苏银行"
                };
                console.log(mccname[fmtscname])
                if (mccname[fmtscname] == "undefind" || mccname[fmtscname] == null) {
                return "";
                } else {
                    return mccname[fmtscname];
                }

            },

        }
    }
    
</script>